<%@ page language="java" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <%
        String bathPath = request.getContextPath();
        pageContext.setAttribute("bathPath", bathPath);
    %>
    <meta charset="UTF-8">
    <title>当前在岗情况</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="${bathPath}/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="${bathPath}/css/common.css">
</head>
<body>
<section class="group-late">
    <div class="layui-form demoTable">
        <div class="layui-inline">
            <label class="layui-form-label">部门</label>
            <div class="layui-input-inline">
                <select type="text" id="depId" name="depId" lay-verify="required" lay-filter="business"
                        autocomplete="off" class="layui-input">
                </select>
            </div>
        </div>


        <div class="layui-inline">
            <label class="layui-form-label">时间</label>
            <div class="layui-input-inline">
                <input type="text" class="layui-input" name="test1" id="test1" placeholder="请选择日期" autocomplete="off">
            </div>
        </div>

        <div class="layui-inline">
            <label class="layui-form-label">在岗类型</label>
            <div class="layui-input-inline">
                <select name="station" id="station">
                    <option value="">全部</option>
                    <option value="0">在岗</option>
                    <option value="1">不在岗</option>
                </select>
            </div>
        </div>


        <div class="layui-inline" style="margin-left: 20px;">
            <button class="layui-btn layui-btn-normal w92" id="select" data-type="reload">查询</button>
        </div>

    </div>
    <div id="stationTableShow" style="display: none;">
        <table class="layui-hide" id="stationTable" lay-filter="test"></table>
    </div>
</section>
</body>
<script src="${bathPath}/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="${bathPath}/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="${bathPath}/js/common.js"></script>
<script>
    var layerIndex = null;

    $(function () {
        initLayUI();
        $.ajax({
            type: "POST",
            async: false,
            data: "",
            url: "${bathPath}/dept/selectDpetName.action",
            success: function (msg) {
                var html = "";
                html += "<option value=''>" + '请选择' + "</option>";
                for (var i = 0; i < msg.length; i++) {
                    html += "<option value='" + msg[i].depID + "'>" + msg[i].depName + "</option>";
                }
                $("#depId").html(html);
            }
        });
    })

    function initLayUI() {
        layui.use(['form', 'laydate', 'layer', 'table'], function () {
            var form = layui.form;
            var laydate = layui.laydate;
            var table = layui.table;
            var layer = layui.layer;
            //日期时间选择器
            laydate.render({
                elem: '#test1'
                , type: 'datetime'
                ,trigger: 'click'
            });

            table.render({
                elem: '#stationTable'
                , url: '${bathPath}/accessLog/selectStation.action'
                , toolbar: true
                ,height: 'full-38'
                , title: '员工在岗表'
                , cols: [[
                    // {type: 'checkbox'}
                    {
                        field: 'depName', title: '部门'
                    }
                    , {field: 'userId', title: '号码'}
                    , {field: 'userName', title: '姓名'}
                    , {field: 'eventTime', title: '签到/退时间'}
                    , {field: 'isType', title: '岗位类型'}
                ]]
                , page: true
                , response: {
                    statusCode: 0 //重新规定成功的状态码为 200，table 组件默认为 0
                }
                , id: 'testReload'
                , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
                    $.each(res.data,function(i,item){
                        res.data[i].isType= formatterStationType(item.isType);
                        // res.data[i].runStartTime= formatTime(item.runStartTime);
                    })
                    return {
                        "code": res.code, //解析接口状态
                        "msg": res.msg, //解析提示文本
                        "count": res.count, //解析数据长度
                        "data": res.data//解析数据列表
                    };
                }
            });
            var $ = layui.$, active = {
                reload: function () {
                    var depId = $('#depId');
                    var time = $('#test1');
                    var stationType = $('#station');
                    if(!(time.val())){
                        layer.alert('请选择查询时间!',{
                            icon:2,
                            title:'提示'
                        })
                        return false;
                    }
                    //执行重载
                        table.reload('testReload', {
                            where: {
                                deptID: depId.val(),
                                checkTime:time.val(),
                                stationType:stationType.val()
                            }
                            , page: {
                                curr: 1
                            }
                        });
                        $('#stationTableShow').show();
                    }
            };

            $('#select').on('click', function () {
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });
        });
    }
</script>
</html>